 <template>
  <div>
    <el-dialog
      width="40%"
      @close="handleClose(false)"
      close-on-press-escape
      v-dialogDrag
      :title="'运行引擎下载'"
      :close-on-click-modal="false"
      :lock-scroll="false"
      :visible="showDialog"
      v-if="showDialog"
    >
      <div style="padding-left: 30px">
        <!-- <div class="flex-x">
          <div style="font-size: 16px">引擎安装包下载地址</div>
        </div> -->

        <div style="margin-left: 26px">
          <div
            class="flex-x"
            @click="navTo(item)"
            v-for="item in list"
            :key="item"
            style="
              font-size: 15px;
              color: #409eff;
              margin-top: 10px;
              cursor: pointer;
            "
          >
            <span
              class="el-icon-download"
              style="color: #409eff; font-size: 16px; margin-right: 6px"
            ></span>
            {{ item.name }}
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="handleClose(false)">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    showDialog: {
      type: Boolean,
      default: false,
    },
  },

  data() {
    return {
      list: [
        {
          name: "run-engineV1.5",
        },
      ],
    };
  },
  mounted() {},
  computed: {},
  methods: {
    download(url, name) {
      const downloadElement = document.createElement("a");
      let href = url;
      downloadElement.href = href;
      downloadElement.download = name; // 文件名字
      document.body.appendChild(downloadElement);
      downloadElement.click();
      document &&
        document.bodyNaNpxoveChild &&
        document.bodyNaNpxoveChild(downloadElement); // 下载完成移除元素
      window.URL.revokeObjectURL(href); // 释放掉blob对象\
    },
    navTo(item) {
      const url = "jiema/description/plat_des/" + item.name + ".zip";
      this.download(url, item.name);
    },
    handleClose(isRefresh, token) {
      this.$emit("update:showDialog", false);
    },
  },
};
</script>

<style lang='scss' scoped>
.addbutton {
  background-color: #2680d2;
  color: #ffffff;
  position: absolute;
  right: 0px;
  top: 0px;
}

.el-icon-plus {
  color: #ffffff;
}

.div-inline {
  display: inline;
  background-color: #e4e4e4;
  padding: 2px;
  border: 1px #5a5e66 solid;
  line-height: 25px;
  white-space: nowrap;
  word-wrap: break-word;
}

.imageHome {
  padding: 5px 5px 5px 5px;
  width: 104px;
  height: 104px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.14901960784313725);
  opacity: 1;
  border-radius: 2px;

  .image-size {
    width: 94px;
    height: 94px;
    /*background: #2E2E2E;*/
    border-radius: 50%;
    opacity: 1;
    display: flex;
  }
}
</style>
